// 首页 style
@import "../../app.scss";
@import "../../src/components/major_class.scss";
body {
  padding-top: rem(3.3867);
}
.mask_box {
  width: 20%;
  position: fixed;
  height: rem(3.36);
  left: 0;
  top: 0;
  background-color: #26b8fb;
}
.page_banner {
  height: rem(11.2533);
  @include bgimage("../../../../img/home/banner.png");
  margin-top: rem(-0.08);
}

.list_nav {
  width: rem(16.2933);
  height: rem(9.3867);
  margin: rem(1.3333) auto 0;
  @include myflex(row, space-between, flex-start, wrap);
  .list_nav_item {
    width: rem(3.28);
    height: rem(3.7867);
    a {
      display: block;
      width: 100%;
      height: 100%;
      @include myflex(column, space-between, center);
      img {
        width: rem(2.3733);
        height: rem(2.3733);
      }
      p {
        font-size: rem(0.7467);
        white-space: nowrap;
        color: $black-color;
      }
    }
  }
}

.pub_title {
  @include mypub_title(3.6267);
  @include myflex(row, flex-start, center);
}

.image {
  width: rem(16);
  margin: rem(0.6667) auto 0;
  .image_banner {
    width: 100%;
    height: rem(9.2);
    @include bgimage("../../../../img/home/banner2.png");
    position: relative;
    .image_banner_img {
      position: absolute;
      width: rem(4);
      height: rem(3.7333);
      left: 50%;
      bottom: rem(-2.6133);
      transform: translateX(-50%);
      @include myflex(column, center);
      img {
        width: rem(2.6133);
      }
      p {
        font-size: rem(0.5867);
        color: $Darkgrey-color;
        span {
          font-size: rem(0.64);
          color: $blue-color;
        }
      }
    }
  }
  .image_text {
    font-size: rem(0.6133);
    @include myflex(row, center);
    margin-top: rem(3.0933);
    text-align: center;
  }
}

.img_list {
  width: rem(18.48);
  height: rem(3.9733);
  margin: rem(0.7467) auto 0;
  @include myflex(row, space-between);
  .img_list_item {
    width: rem(4);
    height: rem(3.9733);
    position: relative;
    font-size: rem(0.6933);
    color: $white-color;

    img {
      width: 100%;
      height: 100%;
    }
    p {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      white-space: nowrap;
      z-index: 2;
    }
  }
}

.banner {
  height: rem(13.7067);
  @include bgimage("../../../../img/home/banner3.png");
}
.text {
  height: rem(3.4667);
  padding: 0 rem(0.64);
  .text_title {
    height: rem(0.8533);
    font-size: rem(0.8);
    @include myflex(row, space-between);
    span {
      color: $red-color;
    }
  }
  .text_image {
    height: rem(0.5867);
    margin-top: rem(0.7467);
    font-size: rem(0.586);
    @include myflex();
    img {
      height: rem(0.56);
      margin-right: rem(0.2667);
    }
    span {
      color: $Darkgrey-color;
      margin-right: rem(0.8);
    }
  }
  .line {
    width: rem(18.5067);
    height: rem(0.0533);
    background-color: $Darkgrey-color;
    margin: rem(1.3333) auto 0;
  }
}
.footer_banner {
  height: rem(4.2133);
  @include bgimage("../../../../img/home/banner4.png");
}
